{% extends 'base.html' %}
{% block content %}
<h2>新增单价配置 - {{ customer.username }}</h2>
{% if error_msg %}
<div class="alert alert-danger">{{ error_msg }}</div>
{% endif %}
<form method="post">
    {% csrf_token %}
    <div class="form-group">
        <label for="package">资费包</label>
        <select name="package" id="package" class="form-control" required onchange="fillPrice()">
            <option value="">请选择资费包</option>
            {% for pkg in packages %}
            <option value="{{ pkg.name }}" data-price="{{ pkg.price }}">{{ pkg.name }} (￥{{ pkg.price }})</option>
            {% endfor %}
        </select>
    </div>
    <div class="form-group">
        <label for="price">单价</label>
        <input type="number" step="0.01" name="price" id="price" class="form-control" required>
    </div>
    <script>
    function fillPrice() {
        var select = document.getElementById('package');
        var price = select.options[select.selectedIndex].getAttribute('data-price');
        document.getElementById('price').value = price || '';
    }
    </script>
    <button type="submit" class="btn btn-success">提交</button>
    <a href="/customer/{{ customer.id }}/price_config/" class="btn btn-secondary">取消</a>
</form>
{% endblock %}
